<template>
  <div>
    <div class="appHead">
      <a href="" class="head-logo">
        <img src="@/assets/img/QB.jpg" alt="" />
        <span class="logo">易点租会员后台管理</span>
      </a>
      <el-dropdown class="head-menu" trigger="click">
        <span class="el-dropdown-link">
          个人中心<i class="el-icon-arrow-down el-icon--right"></i>
        </span>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item><i class="icon el-icon-edit"></i>修改密码</el-dropdown-item>
          <el-dropdown-item><i class="icon el-icon-circle-close">&nbsp;退出</i></el-dropdown-item>
        </el-dropdown-menu>
      </el-dropdown>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },

  components: {},

  methods: {}
};
</script>

<style scoped lang="scss">
.appHead {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 50px;
  padding: 0 30px;
  background: #384b5e;
  line-height: 50px;
  .head-logo {
    color: #fff;
    img {
      border-radius: 50%;
      margin: 13px 10px 0 0;
      width: 24px;
      height: 24px;
      float: left;
    }
    .logo {
      font-size: 14px;
      float: left;
    }
  }
  .head-menu {
    float: right;
    .el-dropdown-link {
      cursor: pointer;
      color: #fff;
    }
    .el-icon-arrow-down {
      font-size: 12px;
    }
    .demonstration {
      display: block;
      color: #8492a6;
      font-size: 14px;
      margin-bottom: 20px;
    }
  }
}
</style>